/* ================= ARTWORK BANNER ================= */


.artwork-banner {
  height: 350px;
  overflow: hidden;
  position: relative;
   margin-top: 70px; 
}

.artwork-banner-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/*.artwork-banner-overlay {*/
/*  position: absolute;*/
/*  inset: 0;*/
/*  background: linear-gradient(*/
/*    135deg,*/
/*    rgba(15,15,36,0.25),*/
/*    rgba(20,20,42,0.25)*/
/*  );*/
/*}*/

.artwork-banner-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgb(15 15 36 / 60%), rgb(20 20 42 / 46%));
}

.artwork-banner h1 {
  font-size: 48px;
  font-weight: 700;
}

.artwork-banner p {
  font-size: 18px;
   color: #d0d0ff;
  color: white;
}

/* ================= ARTWORK SECTION ================= */

.artwork-section {
  background: linear-gradient(180deg, #0f0f24, #0b0b0f);
  color: grey;
  margin-bottom: 0 !important;
  padding: 70px 0 0;
}

.section-heading {
  font-weight: 700;
  font-size: 32px;
  color: #ff9f1c;   /* 🔥 purple accent */
}

/* ================= ART SERVICE CARD ================= */

/* Artwork Section Content */
.section-text {
  font-size: 18px;   /* increase body text */
  line-height: 1.8;
  text-align: justify;
  text-justify: inter-word;
}
 /* corrction */
.artwork-img-box {
  width: 100%;
  height: 220px;   
  overflow: hidden;
}

/* Image */
.artwork-img-box img {
  width: 100%;
  height: 100%;
  object-fit: contain;   
  transition: transform 0.5s ease;
}

/* Hover – premium feel */
.artwork-img-box:hover img {
  transform: scale(1.08);
}

/* Spacing */
.artwork-gallery-section .row {
  row-gap: 36px;
}





/* 🔥 Mobile adjustments */
@media (max-width: 768px) {
  .artwork-img-box {
    height: 170px;
  }
}

/* Extra small mobile */
@media (max-width: 576px) {
  .artwork-img-box {
    height: 150px;
  }
}

/* ===== Artwork content mobile alignment like About page ===== */



@media (max-width: 768px) {

  /* Headings center */
  .artwork-section .section-heading {
    max-width: 90%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
  }

  /* Paragraphs LEFT (not center, not justify) */
  .artwork-section .section-text {
    max-width: 90%;
    margin-left: auto;
    margin-right: auto;
    text-align: justify;   /* 🔥 professional mobile UX */
  }

}


/* View More Button */
.artwork-gallery-section .btn-outline-warning {
  padding: 12px 34px;
  font-size: 16px;
  font-weight: 500;
  background: linear-gradient(90deg, #7f5af0, #2cb67d);             /* button text */
  border: 2px solid;
  border-radius: 30px;
  background-color: transparent;
  transition: all 0.3s ease;
  text-transform: uppercase;
  letter-spacing: 1px;
   margin-bottom: 40px; 
}

/* Hover Effect */
.artwork-gallery-section .btn-outline-warning:hover {
  background-color: #f5a623;
  color: #fff;
  box-shadow: 0 8px 20px rgba(245, 166, 35, 0.35);
  transform: translateY(-2px);
}

/* Focus / Active */
.artwork-gallery-section .btn-outline-warning:focus {
  box-shadow: none;
}

/* Mobile Responsive */
@media (max-width: 768px) {
  .artwork-gallery-section .btn-outline-warning {
    padding: 10px 26px;
    font-size: 15px;
  }
}

.art-card ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.art-card li {
  padding: 10px 0;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  font-size: 15px;
  color: #e0e0e0;
}



/* ================= ART CARD BASE – LIGHT ROYAL ================= */
.art-card {
  border-radius: 22px;
  padding: 30px;
  height: 100%;
  
  box-shadow: 0 20px 40px rgba(0,0,0,0.25);
  transition: all 0.4s ease;
}


.grad-card-1 {
/* background:
    linear-gradient(
      135deg,
      rgba(90,134,255,0.9),
      rgba(44,182,197,0.85),
      rgba(15,15,36,1)
    ); */
    
background: linear-gradient(135deg, rgb(0 0 0 / 90%), rgb(58 104 109 / 85%), rgb(34 34 66));

}

.grad-card-2 {
  /* background: linear-gradient(
    135deg,
    #4d7cff,   
    #0f0f24    
  ); */
  background: linear-gradient(135deg, rgb(0 0 0 / 90%), rgb(58 104 109 / 85%), rgb(34 34 66));
}

.grad-card-3 {
   /* background: linear-gradient(
    135deg,
    #4d7cff,  
    #2cb6c5,  
    #0f0f24    
  );  */
  background: linear-gradient(135deg, rgb(0 0 0 / 90%), rgb(58 104 109 / 85%), rgb(34 34 66));
}


/* ================= LIST STYLE ================= */

.art-card ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.art-card li {
  position: relative;
  padding: 14px 14px 14px 20px;
  font-size: 16px;
  font-weight: 500; 
  color: #fff;   /* 🔥 dark text for light bg */
  border-bottom: 1px solid rgba(0,0,0,0.08);
  transition: all 0.35s ease;
}


/* LEFT INDICATOR LINE */
.art-card li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 4px;
  height: 0;
  background: linear-gradient(
    180deg,
    #9b8cff,   /* brighter purple */
    #3cffb5    /* brighter green */
  );
  border-radius: 12px;
  transform: translateY(-50%);
  transition: height 0.35s ease;
}

/* ================= LINE HOVER EFFECT ================= */
.art-card li:hover {
  color: #fff;
 background: rgba(255,255,255,0.15);  /* soft purple */
  padding-left: 28px;
  font-weight: 600;  
}


.art-card li:hover::before {
  height: 70%;
   box-shadow:
    0 0 12px rgba(155,140,255,0.9),
    0 0 22px rgba(60,255,181,0.8);
}

/* ================= CARD HOVER ================= */

.art-card:hover {
  transform: translateY(-12px) scale(1.03);
  box-shadow: 0 30px 60px rgba(0,0,0,0.6);
}

/* ================= TURN AROUND ================= */

.turnaround-box {
  background: linear-gradient(135deg, #7f5af0, #2cb67d);
  padding: 35px;
  border-radius: 22px;
  color: #fff;
  box-shadow: 0 25px 45px rgba(0,0,0,0.4);

  margin-bottom: 50px;
}

.turnaround-box h3 {
  font-weight: 700;
  margin-bottom: 15px;
}

.turnaround-box p {
  margin: 0;
  font-size: 15px;
}
.artwork-section .row:last-child {
  margin-bottom: 0;
}
/* ================= TURN AROUND SECTION FIX ================= */

.turnaround-section {
  background: linear-gradient(180deg, #0f0f24, #0b0b0f);
 padding: 50px 0 40px;
  padding-bottom: 120px;
    display: flex;
  align-items: center;
  justify-content: center;
}

/* ===== FIX TURN AROUND SECTION SPACING ===== */
.turnaround-section {
  padding-top: 30px;   /* reduce top space */
  padding-bottom: 40px; /* reduce bottom space */
}

.turnaround-section .row {
  margin-top: 0 !important;
}


/* ================= HOVER EFFECT ================= */

.hover-zoom:hover {
  transform: translateY(-12px) scale(1.03);
  box-shadow: 0 30px 60px rgba(0,0,0,0.6);
}

/* ================= RESPONSIVE ================= */

@media (max-width: 768px) {
  .artwork-banner {
  
     height: 260px;   /* mobile optimized */
    margin-top: 60px;
  }

  .artwork-banner h1 {
    font-size: 32px;
  }

  
}